<template>
    <div style="background-color: #f5f5f5;">
        <headers></headers>
        <div class="paddingTop">
        <div class="title">
            <div class="auto">首页 > 学分银行 > 学分转化</div>
        </div>
        <div class="padding250">
            <div class="auto xuefentransform">
                <Tabs value="name1" @on-click="handleTabClick">
                    <TabPane label="全部证书" name="name1">
                        <p class="all">存入已认定证书：<span class="color">{{bankCountInfo.changeCert}}</span> 份，共计：
                            <span class="color">{{bankCountInfo.creditScore}}</span> 分
                            <span class="marginleft">成功申请转换证明：<span class="color">{{bankCountInfo.changeSuccess}}</span> 份</span>
                        </p>
                        <div class="content" v-if="userctList.length > 0">
                            <div class="list clearfix">
                                <p class="lookjilu">
                                    <router-link to="/applayjilu">查看申请证明记录>></router-link>
                                </p>
                                <ul class="clearfix">
                                    <li class="list_item" v-for="item in userctList">
                                        <div class="titles"><img src="../../assets/icon.png" alt="">《广州市物业通识证书名称》</div>
                                        <div class="clearfix">
                                            <ul class="pull-left">
                                                <li>
                                                    <span>持  证 人：</span>{{item.userName}}
                                                </li>
                                                <li>
                                                    <span>证书编号：</span>{{item.certificateNum}}
                                                </li>
                                                <li>
                                                    <span>发证机构：</span>{{item.award}}
                                                </li>
                                            </ul>
                                            <ul class="pull-right">
                                                <li>
                                                    <span>发证时间：</span>{{item.awardTime}}
                                                </li>
                                                <li>
                                                    <span>有效期至：</span>{{item.validity}}
                                                </li>
                                                <li>
                                                    <span>登记时间：</span>{{item.djTime.substring(0,11)}}
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn">
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               class="pull-left"><span>状态：  </span>未通过</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               href="javascript:;" @click="showStatementInfo(item)">重新转换考试</a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="pull-left"><span>状态：  </span>待考试</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="look" href="javascript:;" @click="seeDetail()">查看考试详情>></a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 1"
                                               class="pull-left"><span>状态：  </span>考试合格</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 2" href="javascript:;" @click="showStatementInfo(item)">转换学分考试</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 2">
                                            <a href="javascript:;" v-on:click="applyChange(item)">申请转换证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 1">
                                            <p class="pull-left"><span>状态：  </span>待转换审核</p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 3">
                                            <p class="pull-left"><span>状态：  </span>审核不通过 <a href="javascript:;" @click="seeResult(item)" class="recuse">(查看原因)</a></p>
                                            <a href="javascript:;" v-on:click="applyChange(item)">重新申请证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && (item.creditScore == '' || item.creditScore == null)">
                                            <p class="pull-left1"><span>状态：  </span>审核通过 <a href="javascript:;" v-on:click="downloadProve(item)" class="recuse">(下载转换证明)</a></p>
                                            <p class="pull-left1"><span>证明有效期至：</span>{{item.changeInfo.validityTime.substring(0,11)}} </p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && item.creditScore != '' && item.creditScore != null">
                                            <p class="pull-left"><span>成功转换：  </span>{{item.creditScore}}</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="可转换学分" name="name2">
                        <div class="step">
                            <p>学分转换步骤 <img src="../../assets/xuefenstep.png" alt="" class="stepimg"> <img src="../../assets/uparrow.png" alt=""></p>
                        </div>
                        <div class="ul clearfix">
                            <img src="../../assets/img3.png" alt="" class="pull-left" width="220">
                            <ul>
                                <li>可转换学分：允许转换学分的证书，在获得转换证明后人员可以通过证明到学习中心进行学分转换。</li>
                                <li>1、学分转换需要通过完成学分考试后，申请转换证明操作。</li>
                                <li>2、选择转换考试，完成报名缴费操作。</li>
                                <li>3、按时参加统一学分转换考试。</li>
                                <li>4、转换学分考试合格后，可进一步申请转换证明申请学分转换。</li>
                            </ul>
                        </div>
                        <div class="content" v-if="userctList.length > 0">
                            <div class="list clearfix">
                                <ul class="clearfix">
                                    <li class="list_item" v-for="item in userctList">
                                        <div class="titles"><img src="../../assets/icon.png" alt="">《广州市物业通识证书名称》</div>
                                        <div class="clearfix">
                                            <ul class="pull-left">
                                                <li>
                                                    <span>持  证 人：</span>{{item.userName}}
                                                </li>
                                                <li>
                                                    <span>证书编号：</span>{{item.certificateNum}}
                                                </li>
                                                <li>
                                                    <span>发证机构：</span>{{item.award}}
                                                </li>
                                            </ul>
                                            <ul class="pull-right">
                                                <li>
                                                    <span>发证时间：</span>{{item.awardTime}}
                                                </li>
                                                <li>
                                                    <span>有效期至：</span>{{item.validity}}
                                                </li>
                                                <li>
                                                    <span>登记时间：</span>{{item.djTime.substring(0,11)}}
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn">
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               class="pull-left"><span>状态：  </span>未通过</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               href="javascript:;" @click="showStatementInfo(item)">重新转换考试</a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="pull-left"><span>状态：  </span>待考试</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="look" href="javascript:;" @click="seeDetail()">查看考试详情>></a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 1"
                                               class="pull-left"><span>状态：  </span>考试合格</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 2" href="javascript:;" @click="showStatementInfo(item)">转换学分考试</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 2">
                                            <a href="javascript:;" v-on:click="applyChange(item)">申请转换证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 1">
                                            <p class="pull-left"><span>状态：  </span>待转换审核</p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 3">
                                            <p class="pull-left"><span>状态：  </span>审核不通过 <a href="javascript:;" @click="seeResult(item)" class="recuse">(查看原因)</a></p>
                                            <a href="javascript:;" v-on:click="applyChange(item)">重新申请证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && (item.creditScore == '' || item.creditScore == null)">
                                            <p class="pull-left1"><span>状态：  </span>审核通过 <a href="javascript:;" v-on:click="downloadProve(item)" class="recuse">(下载转换证明)</a></p>
                                            <p class="pull-left1"><span>证明有效期至：</span>{{item.changeInfo.validityTime.substring(0,11)}} </p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && item.creditScore != '' && item.creditScore != null">
                                            <p class="pull-left"><span>成功转换：  </span>{{item.creditScore}}</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="申请转换证明" name="name3">
                        <div class="step">
                            <p>学分转换步骤 <img src="../../assets/xuefenstep1.png" alt="" class="stepimg"> <img src="../../assets/uparrow.png" alt=""></p>
                        </div>
                        <div class="ul clearfix">
                            <img src="../../assets/img3.png" alt="" class="pull-left" width="220">
                            <ul>
                                <li>可申请转换证明：此类证书已完成学分转换考试，可进行转换证明申请操作。学员可使用证明到相应学习中心进行转换操作。</li>
                                <li>1、学选择需要申请证明的证书，点击申请转换证明按钮。</li>
                                <li>2、填写信息后，待审核申请资料。审核周期预计30个工作日内完成。</li>
                                <li>3、审核材料合格后，即申请通过，则平台将提供有效的转换证明。</li>
                                <li>4、成功获得转换证明的证书可在获得转换证明换列表查询。</li>
                            </ul>
                        </div>
                        <div class="content" v-if="userctList.length > 0">
                            <div class="list clearfix">
                                <ul class="clearfix">
                                    <li class="list_item" v-for="item in userctList">
                                        <div class="titles"><img src="../../assets/icon.png" alt="">《广州市物业通识证书名称》</div>
                                        <div class="clearfix">
                                            <ul class="pull-left">
                                                <li>
                                                    <span>持  证 人：</span>{{item.userName}}
                                                </li>
                                                <li>
                                                    <span>证书编号：</span>{{item.certificateNum}}
                                                </li>
                                                <li>
                                                    <span>发证机构：</span>{{item.award}}
                                                </li>
                                            </ul>
                                            <ul class="pull-right">
                                                <li>
                                                    <span>发证时间：</span>{{item.awardTime}}
                                                </li>
                                                <li>
                                                    <span>有效期至：</span>{{item.validity}}
                                                </li>
                                                <li>
                                                    <span>登记时间：</span>{{item.djTime.substring(0,11)}}
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn">
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               class="pull-left"><span>状态：  </span>未通过</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               href="javascript:;" @click="showStatementInfo(item)">重新转换考试</a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="pull-left"><span>状态：  </span>待考试</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="look" href="javascript:;" @click="seeDetail()">查看考试详情>></a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 1"
                                               class="pull-left"><span>状态：  </span>考试合格</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 2" href="javascript:;" @click="showStatementInfo(item)">转换学分考试</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 2">
                                            <a href="javascript:;" v-on:click="applyChange(item)">申请转换证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 1">
                                            <p class="pull-left"><span>状态：  </span>待转换审核</p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 3">
                                            <p class="pull-left"><span>状态：  </span>审核不通过 <a href="javascript:;" @click="seeResult(item)" class="recuse">(查看原因)</a></p>
                                            <a href="javascript:;" v-on:click="applyChange(item)">重新申请证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && (item.creditScore == '' || item.creditScore == null)">
                                            <p class="pull-left1"><span>状态：  </span>审核通过 <a href="javascript:;" v-on:click="downloadProve(item)" class="recuse">(下载转换证明)</a></p>
                                            <p class="pull-left1"><span>证明有效期至：</span>{{item.changeInfo.validityTime.substring(0,11)}} </p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && item.creditScore != '' && item.creditScore != null">
                                            <p class="pull-left"><span>成功转换：  </span>{{item.creditScore}}</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="获得转换证明" name="name4">
                        <div class="step">
                            <p>学分转换步骤 <img src="../../assets/xuefenstep2.png" alt="" class="stepimg"> <img src="../../assets/uparrow.png" alt=""></p>
                        </div>
                        <div class="ul clearfix">
                            <img src="../../assets/img3.png" alt="" class="pull-left" width="220">
                            <ul>
                                <li>获得转换证明：此类证书已成功获得转换证明，学员可保持证明到应用的学习中心转换学分。</li>
                                <li>1、点击下载转换证明，保存证明。</li>
                                <li>2、学员到学习中心提交转换证明，申请学分转换。</li>
                            </ul>
                        </div>
                        <div class="content" v-if="userctList.length > 0">
                            <div class="list clearfix">
                                <ul class="clearfix">
                                    <li class="list_item" v-for="item in userctList">
                                        <div class="titles"><img src="../../assets/icon.png" alt="">《广州市物业通识证书名称》</div>
                                        <div class="clearfix">
                                            <ul class="pull-left">
                                                <li>
                                                    <span>持  证 人：</span>{{item.userName}}
                                                </li>
                                                <li>
                                                    <span>证书编号：</span>{{item.certificateNum}}
                                                </li>
                                                <li>
                                                    <span>发证机构：</span>{{item.award}}
                                                </li>
                                            </ul>
                                            <ul class="pull-right">
                                                <li>
                                                    <span>发证时间：</span>{{item.awardTime}}
                                                </li>
                                                <li>
                                                    <span>有效期至：</span>{{item.validity}}
                                                </li>
                                                <li>
                                                    <span>登记时间：</span>{{item.djTime.substring(0,11)}}
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn">
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               class="pull-left"><span>状态：  </span>未通过</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               href="javascript:;" @click="showStatementInfo(item)">重新转换考试</a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="pull-left"><span>状态：  </span>待考试</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="look" href="javascript:;" @click="seeDetail()">查看考试详情>></a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 1"
                                               class="pull-left"><span>状态：  </span>考试合格</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 2" href="javascript:;" @click="showStatementInfo(item)">转换学分考试</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 2">
                                            <a href="javascript:;" v-on:click="applyChange(item)">申请转换证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 1">
                                            <p class="pull-left"><span>状态：  </span>待转换审核</p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 3">
                                            <p class="pull-left"><span>状态：  </span>审核不通过 <a href="javascript:;" @click="seeResult(item)" class="recuse">(查看原因)</a></p>
                                            <a href="javascript:;" v-on:click="applyChange(item)">重新申请证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && (item.creditScore == '' || item.creditScore == null)">
                                            <p class="pull-left1"><span>状态：  </span>审核通过 <a href="javascript:;" v-on:click="downloadProve(item)" class="recuse">(下载转换证明)</a></p>
                                            <p class="pull-left1"><span>证明有效期至：</span>{{item.changeInfo.validityTime.substring(0,11)}} </p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && item.creditScore != '' && item.creditScore != null">
                                            <p class="pull-left"><span>成功转换：  </span>{{item.creditScore}}</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="成功转换学分" name="name5">
                        <div class="step">
                            <p>学分转换步骤 <img src="../../assets/xuefenstep3.png" alt="" class="stepimg"> <img src="../../assets/uparrow.png" alt=""></p>
                        </div>
                        <div class="ul clearfix">
                            <img src="../../assets/img3.png" alt="" class="pull-left" width="220">
                            <ul>
                                <li>获得转换证明：此类证书已成功获得转换证明，学员可保持证明到应用的学习中心转换学分。</li>
                                <li>1、点击下载转换证明，保存证明。</li>
                                <li>2、学员到学习中心提交转换证明，申请学分转换。</li>
                            </ul>
                        </div>
                        <div class="content" v-if="userctList.length > 0">
                            <div class="list clearfix">
                                <ul class="clearfix">
                                    <li class="list_item" v-for="item in userctList">
                                        <div class="titles"><img src="../../assets/icon.png" alt="">《广州市物业通识证书名称》</div>
                                        <div class="clearfix">
                                            <ul class="pull-left">
                                                <li>
                                                    <span>持  证 人：</span>{{item.userName}}
                                                </li>
                                                <li>
                                                    <span>证书编号：</span>{{item.certificateNum}}
                                                </li>
                                                <li>
                                                    <span>发证机构：</span>{{item.award}}
                                                </li>
                                            </ul>
                                            <ul class="pull-right">
                                                <li>
                                                    <span>发证时间：</span>{{item.awardTime}}
                                                </li>
                                                <li>
                                                    <span>有效期至：</span>{{item.validity}}
                                                </li>
                                                <li>
                                                    <span>登记时间：</span>{{item.djTime.substring(0,11)}}
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn">
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               class="pull-left"><span>状态：  </span>未通过</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 0"
                                               href="javascript:;" @click="showStatementInfo(item)">重新转换考试</a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="pull-left"><span>状态：  </span>待考试</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 1" class="look" href="javascript:;" @click="seeDetail()">查看考试详情>></a>
                                            <p v-if="item.isConvert == 1 && item.isexam == 1 && item.examInfo.certExamStatus == 2 && item.examInfo.cerQualified == 1"
                                               class="pull-left"><span>状态：  </span>考试合格</p>
                                            <a v-if="item.isConvert == 1 && item.isexam == 2" href="javascript:;" @click="showStatementInfo(item)">转换学分考试</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 2">
                                            <a href="javascript:;" v-on:click="applyChange(item)">申请转换证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 1">
                                            <p class="pull-left"><span>状态：  </span>待转换审核</p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 3">
                                            <p class="pull-left"><span>状态：  </span>审核不通过 <a href="javascript:;" @click="seeResult(item)" class="recuse">(查看原因)</a></p>
                                            <a href="javascript:;" v-on:click="applyChange(item)">重新申请证明</a>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && (item.creditScore == '' || item.creditScore == null)">
                                            <p class="pull-left1"><span>状态：  </span>审核通过 <a href="javascript:;" v-on:click="downloadProve(item)" class="recuse">(下载转换证明)</a></p>
                                            <p class="pull-left1"><span>证明有效期至：</span>{{item.changeInfo.validityTime.substring(0,11)}} </p>
                                        </div>
                                        <div class="btn" v-if="item.isApply == 1 && item.changeInfo.auditState == 2 && item.creditScore != '' && item.creditScore != null">
                                            <p class="pull-left"><span>成功转换：  </span>{{item.creditScore}}</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </TabPane>
                </Tabs>
                <span v-if="userctList.length < 1">
                    <nodata tip="暂时还没有证书~"></nodata>
                </span>
            </div>
        </div>
        <!-- 认定声明 -->
        <Modal v-model="statement" width="400" class-name="vertical-center-modal">
            <p slot="header" class="header">转化学分考试说明</p>
            <div class="notice" v-html="statementInfo">
                {{statementInfo}}
            </div>
            <div slot="footer" style="text-align: center">
                <a href="javascript:;" class="read" v-on:click="addStatement()">报名考试</a>
            </div>
        </Modal>
        <!-- 申请转换 -->
        <Modal v-model="changeApply" width="400" class-name="vertical-center-modal">
            <p slot="header" class="header header1">{{certificateName}}</p>
            <ul class="notice notice1">
                <li v-for="(item, index) in scoreList"><span>{{index + 1}}.{{item.name}}：</span>{{item.score}}学分</li>
            </ul>
            <div slot="footer" style="text-align: center">
                <a href="javascript:;" class="read" v-on:click="applyChange()">取消</a>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="javascript:;" class="read" @click="subApplyChange()">申请转换</a>
            </div>
        </Modal>
        <!-- 转换证明审核失败原因model -->
        <Modal v-model="changeResult" width="400" class-name="vertical-center-modal">
            <p slot="header" class="header">查看原因</p>
            <div class="notice">
                {{changeFailResult}}
            </div>
            <div slot="footer" style="text-align: center">
                <a href="javascript:;" v-on:click="seeResult()" class="read">确定</a>
            </div>
        </Modal>
        </div>
        <footers></footers>
    </div>
</template>

<script type="text/ecmascript-6">
    import nodata from '../template/null'
    import headers from '../template/header'
    import footers from '../template/footer'
    import {bankList, getcertifiConfig, getexamType, centreInfoWeb, getHtmlWeb, addcertChange} from '../../http'

    export default {
        name: '',
        props: {},
        data() {
            return {
                certificateName: '',
                statementInfo: '',
                changeFailResult: '',
                statement: false,
                changeResult: false,
                changeApply: false,
                selectType: '',
                bankCountInfo: {},
                userctList: [],
                scoreList: []
            };
        },
        methods: {
            //选项卡转换
            handleTabClick(v) {
                if (v === 'name1') {
                    if (this.selectType == '') {
                        return
                    }
                    this.selectType = ''
                }
                if (v === 'name2') {
                    if (this.selectType == 1) {
                        return
                    }
                    this.certificateList = ''
                    this.selectType = 1
                }
                if (v === 'name3') {
                    if (this.selectType == 2) {
                        return
                    }
                    this.certificateList = ''
                    this.selectType = 2
                }
                if (v === 'name4') {
                    if (this.selectType == 3) {
                        return
                    }
                    this.certificateList = ''
                    this.selectType = 3
                }
                if (v === 'name5') {
                    if (this.selectType == 4) {
                        return
                    }
                    this.certificateList = ''
                    this.selectType = 4
                }
                this.getInfo();
            },
            //下载转换证明
            downloadProve(v) {
                window.open(v.changeInfo.convertCertHtml);
            },
            //查看转换证明审核失败原因
            seeResult(v){
                if(this.changeResult){
                    this.changeResult = false
                    return
                }
                this.changeResult = true
                this.changeFailResult = v.changeInfo.reason
            },
            //查看考试详情
            seeDetail(){
                this.$router.push({
                    name: "myExamPage",
                })
            },
            //点击提交申请转换证明
            subApplyChange(){
                let that = this
                addcertChange({usercertifiId: that.usercertificateId}).then(res => {
                    if(res.code === 200) {
                        this.$Notice.success({
                            title: '申请转换证明提醒',
                            desc: '申请已提交，请等待审核!',
                            duration: 3,
                        });
                        that.getInfo()
                    }
                    that.changeApply = false
                })
            },
            //点击申请转换证明转换
            applyChange(v){
                if(this.changeApply){
                    this.changeApply = false
                    return
                }
                let that = this
                this.certificateName = v.certificateName
                this.usercertificateId = v.id
                getcertifiConfig({usercertificateId: v.id}).then(res => {
                    if(res.code === 200) {
                        that.scoreList = new Array()
                        res.data[0].coursemap.forEach(function (eve) {
                            let op = eve.courseScore.split(',')
                            let newData = {'name': op[0], 'score': op[1]}
                            that.scoreList.push(newData)
                        })
                        this.changeApply = true
                    }
                })
            },
            //报考认定考试
            addStatement(){
                centreInfoWeb().then(res => {
                    if(res.code === 200){
                        this.$router.push({
                            name:'myzhengshubaokao',
                            query: {
                                examName: this.examItem.examName,
                                examId: this.examItem.examId,
                                userId: res.data.id,
                                usercertificateId: this.usercertificateId
                            }
                        })
                    }
                })
            },
            //查询证书认定考试说明
            showStatementInfo(v){
                this.usercertificateId = v.id
                if(this.statement){
                    this.statement = false
                    return
                }
                this.statement = true
                let that = this
                getexamType({syscertificateId: v.syscertifiId}).then(res => {
                    that.examItem = res.data[0]
                    console.info(res)
                })
            },
            getInfo() {
                let that = this
                //获取用户学分银行列表
                bankList({type: that.selectType}).then(res => {
                    console.info(res)
                    that.bankCountInfo = res.data.bankCountInfo
                    that.userctList = res.data.userctList
                })
            },
            //获取认定说明内容
            getStatementInfo(){
                getHtmlWeb({type: 'rdsm'}).then(res => {
                    this.statementInfo = res.data.html.htmlContent;
                })
            }
        },
        created() {
            this.getInfo()
            this.getStatementInfo()
        },
        components: {
            headers,
            footers,
            nodata
        }
    }
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
    .title {
        font-size: 14px;
        color: #fff;
        height: 60px;
        line-height: 60px;
        background-color: #2F261E;
        text-align: left;
    }

    .xuefentransform {
        padding-top: 30px;

        .all {
            color: #666;
            font-size: 14px;
            background-color: #fff;
            text-align: left;
            margin-bottom: 16px;
            padding: 20px 30px;

            .color {
                color: #FF0000;
            }

            .marginleft {
                margin-left: 40px;
            }
        }

        .step {
            background-color: #fff;
            font-size: 22px;
            font-weight: 700;
            color: #333;
            text-align: left;
            padding: 20px 45px;

            .stepimg {
                vertical-align: middle;
                margin: 0 95px;
            }
        }

        .ul {
            background-color: #F2EFEA;
            padding: 30px 40px;
            color: #94795F;
            font-size: 14px;
            margin-bottom: 20px;

            ul {
                margin-left: 250px;
                text-align: left;
                line-height: 30px;

            }

        }
    }

    .list {
        background-color: #fff;
        padding: 40px 15px 0;
        text-align: left;

        .lookjilu {
            text-align: right;
            margin-bottom: 30px;

            a {
                color: #B2936B;
                font-size: 16px;

            }
        }

        .list_item {
            padding: 30px 25px 15px;
            box-shadow: 0px 0px 10px #ececec;
            border-radius: 10px;
            float: left;
            margin-bottom: 40px;
            margin-right: 40px;
            width: 360px;
            height: 225px;

            &:nth-child(3n) {
                margin-right: 0px;
            }

            .titles {
                font-size: 16px;
                color: #000;

                img {
                    vertical-align: middle;
                    margin-right: 5px;
                }
            }

            .clearfix {
                border-bottom: 1px dashed #DBDBDB;
                margin-bottom: 15px;
            }

            ul {
                margin: 10px 0 15px;

                li {
                    font-size: 12px;
                    color: #666;
                    line-height: 25px;

                    span {
                        color: #000;
                    }
                }
            }

            .btn {
                text-align: right;

                a {
                    display: inline-block;
                    width: 100px;
                    height: 36px;
                    line-height: 36px;
                    border-radius: 5px;
                    font-size: 14px;
                    text-align: center;
                    border: 1px solid #B2936B;
                    color: #B2936B;
                    /*&:first-child{*/
                    /*border:1px solid #999;*/
                    /*color: #999;*/
                    /*margin-right: 50px;*/
                    /*}*/

                }

                .color666 {
                    border-color: #999;
                    color: #999;
                    margin-left: 10px;
                }

                .pull-left, .pull-left1 {
                    color: #666;
                    font-size: 14px;
                    margin-top: 8px;

                    span {
                        color: #000;
                    }

                    .recuse {
                        border: none;
                        color: #0066CC;
                        width: auto;
                        height: auto;
                        line-height: normal;
                    }
                }

                .width75 {
                    width: 98px;
                    text-align: left;
                    margin-top: 0;
                }

                .pull-left1 {
                    text-align: left;
                    margin-top: 0;
                }

                .look {
                    border: none;
                    width: 105px;
                }
            }
        }
    }

    .header {
        font-size: 22px;
        color: #333;
        text-align: center;
        font-weight: 700;
        height: 30px;
        line-height: 30px;
    }

    .header1 {
        overflow: auto;
        white-space: pre-wrap;
        text-overflow: inherit;
        height: auto;
        line-height: 30px;
        width: 95%;
        margin: auto;
    }

    .notice {
        font-size: 14px;
        color: #666;
        line-height: 25px;

        span {
            color: #000;
        }
    }

    .notice1 {
        text-align: right;

        span {
            float: left;
        }
    }

    .read {
        background-color: #B2936B;
        color: #fff;
        display: inline-block;
        width: 150px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        border-radius: 5px;
        font-size: 18px;
    }
</style>
